<!DOCTYPE html>
<html lang="en">
	<head>
	<!-- META -->
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
		
	<!-- SEO -->
		<meta name="description" content="" />		
		
	<!-- TITLE -->
		<title>HTML5 Template - Page Description</title>
		
	<!-- FAVICON -->
		<link rel="shortcut icon" href="img/favicon.png" />
		
	<!-- FONTS -->
		<link href="http://fonts.googleapis.com/css?family=Oswald:400,300|Open+Sans:400italic,700italic,400,700|Open+Sans+Condensed:300,700" rel="stylesheet" type="text/css">
		
	<!-- STYLES -->
		<link href="css/bootstrap.css" rel="stylesheet" type="text/css" />
		<link href="css/icons/style.css" rel="stylesheet" type="text/css" />
		<link href="css/main.css" rel="stylesheet" type="text/css" />
		
	<!-- IE -->
		<!--[if lt IE 9]>
			<script type="text/javascript" src="js/ie/css3mq.js"></script>
			<script type="text/javascript" src="js/ie/html5.js"></script>
		<![endif]-->
	</head>
	
	<body>
	<!-- MAIN WRAP -->
		<div id="main-wrap">

			<div id="navigation" class="navigation-active">
				<div id="logo">
					<a href="#">
						<img src="img/logo.png" alt="Site Logo" />
					</a>
				</div><!-- #logo -->

				<ul id="main-menu">
					<li>
						<a href="#">Home</a>
					</li>
					<li class="current has-submenu">
						<a href="#">Features</a>
						<ul>
							<li>
								<a href="#">Item</a>
							</li>
							<li class="current">
								<a href="#">Item</a>
							</li>
							<li>
								<a href="#">Item</a>
							</li>
							<li class="has-submenu">
								<a href="#">Item</a>
								<ul>
									<li>
										<a href="#">Item</a>
									</li>
									<li>
										<a href="#">Item</a>
									</li>
									<li>
										<a href="#">Item</a>
									</li>
									<li>
										<a href="#">Item</a>
									</li>
									<li>
										<a href="#">Item</a>
									</li>
								</ul>
							</li>
							<li>
								<a href="#">Item</a>
							</li>
						</ul>
					</li>
					<li>
						<a href="#">Work</a>
					</li>
					<li>
						<a href="#">Blog</a>
					</li>
					<li>
						<a href="#">Contact</a>
					</li>
				</ul><!-- #main-menu -->

				<div id="navigation-footer">
					<div class="social-icons">
						<a href="#" title="Facebook"><i class="wb-icon-facebook2"></i></a>
						<a href="#" title="Twitter"><i class="wb-icon-twitter2"></i></a>
						<a href="#" title="GitHub"><i class="wb-icon-github2"></i></a>
						<a href="#" title="Dribbble"><i class="wb-icon-dribbble2"></i></a>
						<a href="#" title="Behance"><i class="wb-icon-behance"></i></a>
					</div><!-- .social-icons -->

					<a href="#" class="navigation-toggle">
						<i class="wb-icon-arrow-right4 inactive"></i>
						<i class="wb-icon-arrow-left4 active"></i>
					</a><!-- .navigation-toggle -->
				</div>
			</div><!-- #navigation -->